<template>
  <div class="recorder-box">
      <animation
        :config="config"
        ref="animation"
        @stop="stopVideo"
      />
  </div>
</template>

<script>
import axios from 'axios';
import Animation from '../animation/index.vue';
export default {
    components: {
        Animation,
    },
    data() {
        return {
            config: {},
        };
    },
    mounted() {
        console.log('uid===>', this.$route.query.uid)
        axios({
            url: '/api/getGenerator',
            method: 'get',
            params: {
                uid: this.$route.query.uid
            },
        }).then((res) => {
            const { code, data } = res.data 
            this.config = JSON.parse(data.config);
            this.$nextTick(() => {
                // window.startRecorder(() => {
                    
                //     return true;
                // });
                // window.recorderPrepared();
                console.log('send message==>');
                window.postMessage('START_RECORDING');
                this.$refs.animation.start();
                
            });
        });
    },
    methods: {
        stopVideo() {
            // window.stopRecorder();
            window.postMessage('STOP_RECORDING');
            
        }
    }
}
</script>

<style>

</style>